const path=require('path')
//导入在内存中生成html页面的插件
const htmlWebpackPlugin=require('html-webpack-plugin')
  // vue配置文件
const VueLoaderPlugin = require('vue-loader/lib/plugin');
//通过node模块，向外暴露一个配置对象
module.exports={
    entry:path.join(__dirname,'./src/main.js'),//打包文件,入口文件
    output:{//指定输出选项
        path:path.join(__dirname,'./dist'),//打包好的文件存放地址
        filename:'bundle.js'//打包好文件的文件名
    },
    plugins:[//配置插件节点
      // vue配置文件
     new VueLoaderPlugin(),
     new htmlWebpackPlugin({
       
       template:path.join(__dirname,'./src/index.html'),//指定模板页，
       //将来会根据指定的页面路径，去生成内存中的页面
       filename:'index.html'//指定生成页面的名称
     })
    ],
    mode:'development',//设置mode
   module:{//配置所有第三方loader 模块的
    rules:[//第三方模块的匹配规则
      {test:/\.css$/,use:['style-loader','css-loader']},
        // 需要安装url-loader   [name].[ext]作用是显示图片的原始名称和后缀名 32位hash值 [hash:8]在图片名称前面放置8位的hash值，便于区分图片，以免名称重复
        // limit给定的值，是图片的字节大小，如果图片实际大小大于或等于limit值的大小，那么就不会转为base64格式
        // 的字符串，否则就会转为base64的字符串
        {test:/\.(jpg|png|gif|bmp|jpeg)$/,use:'url-loader?limit=11361&name=[hash:8]-[name].[ext]'},//处理图片路径的loader
        {test:/\.(ttf|eot|svg|woff|woff2)$/,use:'url-loader'},//处理字体文字的loader
        // 配置使用es6的语言
        {test:/\.js$/,use:'babel-loader',exclude:/node_modules/},//配置babel，来转换高级的es语法
        {test:/\.vue$/,use:'vue-loader'}
    ]
     },
     resolve:{
       alias:{//修改vue被导入时候的包路径
          // "vue$":"vue/dist/vue.js"
       }
     }
} 